<template>
  <div>
    <p>父组件接收子组件的值：{{childData}}</p>
    <Child ref="aRef" :msg="msg" @childFn="childFn"></Child>
    <h1>ref: {{refData}}</h1>
  </div>
</template>

<script setup lang="ts">
import { ref, nextTick, onMounted } from 'vue';
import Child from './child.vue';

let childData = ref('null')
let refData = ref<string | undefined>('null')
const msg = ref('赋值123')

const childFn = (e:any) => {
  console.log('触发子组件传值')
  console.log(e)
  childData.value = e.value
}
const aRef = ref<InstanceType<typeof Child> | null>(null)
console.log(aRef.value?.name);
refData.value = aRef.value?.name
onMounted(() => {
  console.log(aRef.value?.name)
})
// nextTick(() => {
//   console.log(aRef.value?.name);
//   refData.value = aRef.value?.name
// })


</script>

<style scoped>

</style>